const iconArrowLeft = document.querySelector('.icon-arrow-left')
const body = document.querySelector('body')
const main = document.querySelector('.main')
const swiperWrapper = document.querySelector('.swiper-wrapper')
const introduce = document.querySelector('.introduce')
const content = document.querySelector('.content')
const jia= document.querySelector('.jia')
const message = JSON.parse(localStorage.getItem('message'))
const mask = document.querySelector('.mask')
const tishi = document.querySelector('.tishi') 
iconArrowLeft.addEventListener('click',function () {
  history.back()
})
function getId(goodsId) {
  let id = window.location.search.substr(1).match(new RegExp("(^|&)" + goodsId + "=([^&]*)(&|$)"))
  return id != null? unescape(id[2]):null
}
let goodsId = getId("goodsId");
axios.get('goods/detail', {
  params: {
    goodsId,
  }
}).then(({ data: res }) => {
  // console.log(res)
  //渲染轮播图
  let str = ''
  res.data.detail.goods_images.forEach((ele,i) => {
    str+=`<div class="swiper-slide">
    <img
      src=${ele.external_url}
    />
  </div>`
  })
  swiperWrapper.innerHTML=str
       let line_price_maxs = res.data.detail.line_price_max == 0.00 ? '' : '￥' + res.data.detail.line_price_max
  introduce.innerHTML=`<span>
            <span> <span>￥${res.data.detail.goods_price_max}</span><del>${line_price_maxs}</del></span>
            <span>已售${res.data.detail.goods_sales}件</span>
            </span>
            <p>${res.data.detail.goods_name}</p>`
  
  content.innerHTML=`<div class="miaoshu">商品描述</div>
                    <img src=${res.data.detail.goods_image} alt="" srcset="" />`
 
})
//加入购物车事件
jia.addEventListener('click',function () {
  if (!message) {
    mask.style.display = 'block'
    tishi.style.display = 'block'
    document.querySelector('.btn_hui').addEventListener('click',function () {
      location.href='./classify.html'
    })
    document.querySelector('.btn_qu').addEventListener('click',function () {
      location.href='./login.html'
    })
  } else {
    location.href=`./gouwuche.html?goodsId=${goodsId}`
  }
})

// 获取评论
axios.get('/comment/listRows', {
  params: {
    goodsId,
    limit:2,
}}).then(({data:res}) => {
  console.log(res.data)
  if (res.data.total === 0) {
    document.querySelector('.comment').style.display='none'
  }
  let str = ''
  document.querySelector('.ping').innerHTML=`商品评价（${res.data.total}）条`
  res.data.list.forEach((item) => {
    item.user.avatar_url=item.user.avatar_url?item.user.avatar_url:'http://cba.itlike.com/public/mweb/static/default-avatar.png'
    str+= `<div class="comment_name">
    <div>
      <img
        src=${item.user.avatar_url}
        alt=""
      /><span class="username">${item.user.nick_name}</span
      ><span class="xingxing">❤ ❤ ❤ ❤ ❤</span>
    </div>
    <p>${item.content}</p>
    <p class='comment_time'>${item.create_time}</p>
  </div>`
  })
  document.querySelector('.comment_box').innerHTML=str
})
document.querySelector('.cha').addEventListener('click',function () {
  location.href=`./CommentsList.html?goodsId=${goodsId}`
})
